import { definePropType } from '@/utils'
import type { TableColumnCtx } from 'element-plus'

type Placement =
  | 'top'
  | 'top-start'
  | 'top-end'
  | 'bottom'
  | 'bottom-start'
  | 'bottom-end'
  | 'left'
  | 'left-start'
  | 'left-end'
  | 'right'
  | 'right-start'
  | 'right-end'
export interface ToopTip {
  effect?: 'dark' | 'light'
  placement?: Placement
  appendTo?: HTMLElement | any
  content?: string
  rawContent?: boolean
  trigger?: 'hover' | 'click' | 'focus' | 'contextmenu'
}

export interface ToolTipCustomAttrs {
  color?: string
  width?: string
  fontSize?: string
  onToolClick?: (row: Record<string, any>) => any | null
}

export interface TableColumn<T extends string = string>
  extends Partial<TableColumnCtx<any>> {
  key: T
  label?: string
  showTooltip?: boolean
  // tooltip 原生属性
  showTootipAttrs?: ToopTip
  // tooltip 扩展属性
  showToopCustomAttrs?: ToolTipCustomAttrs
}

export default {
  columns: {
    type: definePropType<TableColumn[]>(Array),
    default: () => []
  },
  http: Function,
  params: {
    type: Object,
    default: () => ({})
  },
  selectedKeys: {
    type: Array,
    dfault: () => []
  },
  isReload: {
    type: Boolean,
    default: true
  },
  tableData: {
    type: definePropType<any>(Array),
    default: () => []
  },
  // 切换页码 / el-table data变化，不会更新selectKeys
  // 除非手动设置 selectKeys
  selectKeysKeep: {
    type: Boolean,
    default: true
  },
  rowKey: {
    type: definePropType<string | ((row: Record<string, any>) => any)>([
      String,
      Function
    ]),
    default: 'id'
  },
  // 是否 懒加载 --- .> 即当 params 赋值完整 后再去掉接口，防止 接口调用两次，导致数据不一致
  lazyLoad: {
    type: Boolean,
    dfault: false
  },
  // 仅对  type=selection 的列有效
  // 需指定 row-key 来让这个功能生效。
  keepSelection: {
    type: Boolean,
    default: true
  },
  paramsConfig: {
    type: Object,
    default: () => ({
      page: 1,
      pageSize: 10
    })
  },
  // 是否开启 分页
  paginationConfig: {
    type: Boolean,
    default: true
  },
  // 开启 checkbox
  showSelection: {
    type: Boolean,
    default: true
  },
  // 显示序列号
  showNumber: {
    type: Boolean,
    default: true
  },
  selectWidth: {
    type: Number,
    default: 55
  },
  numberWidth: {
    type: Number,
    default: 90
  },
  psges: {
    type: Object,
    default: () => ({
      pageNo: 1,
      pageSize: 10,
      pageSizes: [10, 20, 30]
    })
  }
} as const

export const tableEmit = {
  'update:isReload': (data: boolean) => !!data,
  'update:selectedKeys': (data: number[]) => !!data
}
